Lab 29

Graphical User Interfaces (GUI's) and guide

CS211 Lab Policy:

• This lab exercise will not be graded.
• Submit as much as you have completed before the end of the lab period in which it is assigned.
• If you do not finish this lab work, it is to your advantage to finish it outside of class. Please re-submit your finished work to the course web site.
• You may received help from anyone in completing this lab.
• You may not submit another student's code as part of your lab.

Instructions:

Use MATLAB's guide tool to create the files Lab29.m and Lab29.fig.  This simple GUI will count the number of times a user clicks a button.

1. Using guide, create a simple GUI that contains the three components listed below. A picture of the desired GUI is shown below as well.

• a push button labeled "Click Button"
• a static text field that displays "Total Clicks:"
• a static text field that displays the total number of times the button has been clicked by the user.

2. Set the following property values of the 3 components:

• For the push button:

  • Set the Tag property to Click_Button. (This means the callback function name will be Click_Button_callback.)

  • Set the Units property to 'normalized'

  • Set the String property to 'Click Button'.

  • Set the FontSize property to 14

  • Set the ForegroundColor property to blue.
     

• For the static text field that displays "Total Clicks:":

  • Set the Tag property to Total_clicks_label.

  • Set the Units property to 'normalized'

  • Set the String property to 'Total Clicks:'.

  • Set the FontSize property to 14
     

• For the static text field that displays the count value:

  • Set the Tag property to Count_label. (This means we will access this object using  handles.Count_label.)

  • Set the Units property to 'normalized'

  • Set the String property to '0'

  • Set the FontSize property to 14

  • Set the HorizontalAllignment property to 'right'

3. Add code to the callback function Click_Button_callback() to increment the displayed number of clicks.
    

   • The handles structure is used for accessing GUI objects and sharing values between callback functions.

   • Every component in a GUI has a corresponding field in the handles structure.

   • A component's Tag property specifies the field name in the handles structure.

   • Study the statements below and then add them to your Click_Button_callback() function. (You must save your file in guide to create the corresponding code file. You edit the code file using the MATLAB editor.)

   % Get the current value of the number of button clicks
   Count = str2num(get(handles.Count_label, 'String'));
   
   % Increment the count value
   Count = Count + 1;
   
   % Change the value that is displayed in the GUI
   set(handles.Count_label, 'String', num2str(Count))
    

4. Run and test your GUI program .
    

5. Add a second push button to your GUI and label it 'Reset'. Then add code to its callback function that resets the counter back to zero. A picture of what this might look like is shown below.
   
   
    

6. In your 'Click Button' callback function, display the entire contents of the handles argument (i.e., disp(handles) ). Run your program and examine the output. Make sure you understand that the handles structure allows you to access all components of your GUI program from any callback function.
   
   Now display all the properties of one of your GUI components. For example, disp( set(handles.Click_Button) ). Run your program and examine the output. Make sure you understand that any property of any component can be changed at any time during the execution of a GUI program. After you are finished investigating the outputs, you can comment out these disp() statements.

Turn-in:

Submit your Lab29.m and Lab29.fig files.